<template>
	<view class="p-2 customer_edit">
		<view class="bg-white p-2 rounded-10">
			<u--form labelPosition="top" :model="formData" :rules="rules" ref="uForm">
				<u-form-item label=" " prop="name">
					<view class="flex-1">
						<view class="ml-1 mb-2">姓名 <text class="text-danger">*</text></view>
						<u--input v-model="formData.name" border="none" clearable placeholder="请输入"
							maxlength="30"></u--input>
					</view>
				</u-form-item>
				<u-form-item label=" " prop="phone">
					<view class="flex-1">
						<view class="ml-1 mb-2">电话 <text class="text-danger">*</text></view>
						<u--input v-model="formData.phone" border="none" clearable placeholder="请输入"
							maxlength="11"></u--input>
					</view>
				</u-form-item>
				<u-form-item label=" " prop="address">
					<view class="flex-1">
						<view class="ml-1 mb-2">地址 <text class="text-danger">*</text></view>
						<u--input v-model="formData.address" border="none" clearable placeholder="请输入"
							maxlength="100"></u--input>
					</view>

				</u-form-item>
			</u--form>
		</view>
		<view class="btn m-o col-8 rounded-40 position-fixed"
			style="height: 70rpx;bottom: 60rpx;left: 50%;transform: translate(-50%,0);" @click="submit">确定</view>

	</view>
</template>

<script>
	import {
		customerEdit,
		customerAdd,
		customerDetail
	} from '@/common/api/customer.js'
	export default {
		data() {
			return {
				formData: {
					id:null,
					name: '',
					phone: '',
					address: '',
					saleUserId:''
				},

				rules: {
					name: {
						type: 'string',
						required: true,
						message: '请填写姓名',
						trigger: ['blur', 'change']
					},
					phone: {
						type: 'string',
						required: true,
						message: '请填写电话',
						trigger: ['blur', 'change']
					},
					address: {
						type: 'string',
						required: true,
						message: '请填写地址',
						trigger: ['blur', 'change']
					},

				},
				radio: '',
				switchVal: false
			};
		},
		onLoad(option) {
			this.formData.saleUserId=this.app_user_info.id;
			if (option.id) {
				this.formData.id = option.id;
				this.getDetail()
			}
		},
		methods: {
			getDetail() {
				customerDetail({
					id: this.formData.id
				}).then(res => {
					this.setFormData(res.data)
				})
			},
			
			submit() {
				this.$refs.uForm.validate().then(res => {
					if (this.formData.id) {
						customerEdit(this.formData).then(res => {
							uni.$u.toast('编辑成功')
							this.navigateBack()
						})
					}else{
						customerAdd(this.formData).then(res => {
							uni.$u.toast('保存成功');
							this.navigateBack()
						})
					}

				}).catch(errors => {
					uni.$u.toast('校验失败')
				})
			}
		},
		onReady() {
			this.$refs.uForm.setRules(this.rules)
		},
	};
</script>


<style lang="scss">
	.customer_edit {
		.u-input {
			background-color: #F9F9F9 !important;
			padding: 10rpx 20rpx !important;
		}
	}
</style>